<template>
  <view class=" u-flex-x-center logo">
    <up-image :show-loading="true" src="/static/images/01_22wz.png" width="188rpx" height="188rpx"></up-image>
  </view>
  <up-text text="房小圈" color="#000000" align="center" size="18" bold></up-text>
  <view class="u-flex-xy-center">
    <image src="@/static/images/01_18efd.png" @click="checked = !checked" class="login-img" v-if="!checked" mode="">
    </image>
    <image src="@/static/images/01_18mj.png" @click="checked = !checked" class="login-img" v-else mode=""></image>
    <view class="u-text-center login-text">
      <text>阅读并同意</text>
      <text @click="$u.route('/pages/index/agreement?type=3')"> 《用户协议》</text>
      <text @click="$u.route('/pages/index/agreement?type=4')">《隐私政策》</text>
    </view>
  </view>
  <view class="login-btn" v-if="!checked">房小圈</view>
  <button class="login-btn" open-type="getPhoneNumber" v-else @getphonenumber="_mp_login">房小圈</button>
</template>

<script setup>
  import { ref } from 'vue';
  import { mp_login } from '../../config/api';
  import { getCache, setCache } from '../../util/util';
  const checked = ref(false)
  const _mp_login = ({ detail }) => {
    uni.login({
      success: ({ code }) => {
        if (detail.errMsg.indexOf('fail') != -1) {
          uni.$u.toast('授权失败')
          return
        }
        mp_login({ ...detail, code, invite: getCache('code') || getCache('invite') }).then(res => {
          uni.removeStorageSync('code')
          uni.removeStorageSync('invite')
          console.log(res)
          uni.$chat.login({
              userID: res.data.id.toString(),
              userSig: res.data.userSig
            })
            .then(res => {
              console.log(res, '123123132')
            }).catch(err => {
              console.log(err, '321321321')
            })
          setTimeout(() => {
            uni.navigateBack({
              fail: () => {
                uni.switchTab({
                  url: '/pages/index/index'
                })
              }
            })
          }, 500)
          setCache('userInfo', res.data)
          setCache('token', res.data.token)
        })
      }
    })
  }
</script>

<style scoped lang="scss">
  .logo {
    padding-top: 142rpx;
    margin-bottom: 24rpx;
  }

  .login-text {
    font-size: 24rpx;
    margin-top: 200rpx;

    text+text {
      color: #F87610;
    }
  }

  .login-img {
    width: 24rpx;
    height: 24rpx;
    margin-top: 200rpx;
    margin-right: 10rpx;
  }

  .login-btn {
    width: 546rpx;
    height: 94rpx;
    background: #F87610;
    border-radius: 24rpx;
    line-height: 94rpx;
    color: #fff;
    text-align: center;
    margin: 16rpx auto;
    font-size: 30rpx;
  }
</style>